<template>
	<view class="tip">
		<view style="display: flex;">
			<uni-icons type="notification-filled"></uni-icons>
			<view class="tip_info">
				提示：您当前有
				<span @click="getData(4)">{{ hintData[4] }}位</span>
				线索未跟进，
				<span @click="getData(3)">{{ hintData[3] }}位</span>
				客户即将被回收（其中3星以上客户
				<span @click="getData(2)">{{ hintData[2] }}位</span>
				），五天以上未跟进客户
				<span @click="getData(1)">{{ hintData[1] }}位</span>
				，三天以上未跟进客户
				<span @click="getData(0)">{{ hintData[0] }}位</span>
			</view>
		</view>

		<view v-if="showHintInfo" style=" text-align: right; flex: 1; margin-right: 20px; color: red; font-weight: 600;;">
			选择中
		</view>
	</view>
</template>

<script>
import { mapState } from 'vuex' 
export default{
	computed: {  
	    ...mapState({  
	          hintData: state => state.threadMy.hintData,  
			  showHintInfo: state => state.threadMy.showHintInfo,  
	    }),
	}, 
	
	inject: ['resetPagination'],
	
	methods:{
		getData(e){
			const baseCondition = 'latestTime >' + (Date.now() - (7 * 86400000)) + ' && clientStatus == 0';  
			const additionalConditions = {  
				4: 'timestamp === latestTime',  
				3: 'latestTime <=' + (Date.now() - (6 * 86400000)),  
				2: 'latestTime <=' + (Date.now() - (6 * 86400000)) + ' && class >= 3',  
				1: 'latestTime <=' + (Date.now() - (5 * 86400000)),  
				0: 'latestTime <=' + (Date.now() - (3 * 86400000))  
			};  
		  
			let condition = baseCondition;  
			if (additionalConditions[e]) {  
				condition += ' && ' + additionalConditions[e];  
			}
			this.resetPagination()
			this.$store.commit('threadMy/setCurrent', 1); 
			this.$store.dispatch('threadMy/reqGetThreaData', condition);  
			this.$store.commit('threadMy/setShowHintInfo', true);  
		}
	}
}
</script>

<style lang="scss" scoped>
.tip{
	height: 36px;
	line-height: 36px;
	width: 100%;
	background-color: #f1f1f1;
	padding-left: 30px;
	box-sizing: border-box;
	margin-top: 10px;
	display: flex;
	.tip_info{
		margin-left: 10px;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}
	span{
		color: red;
		cursor: pointer;
	}
}
</style>

